<template>
	<view class="detailWrapper">
		<view class="noRun">
			<view class="detailHeader">
				<button class="back" @tap="backLast()"></button>
				采购订单详情
				<button class="change" style="display: none;"></button>
			</view>
		</view>
		<view class="detailContainer">
			<view class="GoodsNameWrap">
				<view class="goodsInfo">
					<view class="goodsName">
						<text>单据号</text>
						<text>JHD289023489</text>
					</view>
					<view class="goodsBar">
						<text>日期</text>
						<text>2019-09-23</text>
					</view>
				</view>
			</view>
		    <view class="goodType">
		    	<text>供应商</text>
		    	<text>林三</text>
		    </view>
			<view class="goodReturm">
				<text>备注</text>
				<text>12111111111111111111111111111111</text>
			</view>
		    <view class="goodJcInfo">
				<view>
					<text>选择货品（{{list.length}}）</text>
					<text>￥7213.00</text>
				</view>
			</view>
			<view class="content">
				<view class="uni-list">
					<view class="uni-list-cell" hover-class="uni-list-cell-hover" v-for="(item,index) in list" :key="index"
					@tap="openInfo" :data-newsid="item.post_id">
						<view class="uni-media-list">
							<image class="uni-media-list-logo" :src="item.author_avatar" style="width:70upx;height: 70rpx;"></image>
							<view class="uni-media-list-body">
								<view class="uni-media-list-text-top">{{item.name}}</view>
								<view class="uni-media-list-text-bottom uni-ellipsis">单价:{{item.money}}</view>
							</view>
							<view class="uni-media-list-body">
								<view class="uni-media-list-text-top"> 数量:{{item.count}}</view>
								<view class="uni-media-list-text-bottom uni-ellipsis">金额:{{item.money02}}</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		    <view class="goodAsForm">
				<text>结算账户</text>
				<text>支付宝</text>
			</view>
			
			<!-- 统计金额 -->
			<view class="goodsCount">
				<view class="content">
					<view class="uni-list">
						<view class="uni-list-cell" hover-class="uni-list-cell-hover" >
							<view class="uni-media-list">
								
								<view class="uni-media-list-body">
									<view class="uni-media-list-text-top">应付款</view>
									<view class="uni-media-list-text-bottom uni-ellipsis">实付款:</view>
								</view>
								<view class="uni-media-list-body">
									<view class="uni-media-list-text-top"> 150</view>
									<view class="uni-media-list-text-bottom uni-ellipsis">1234</view>
								</view>
								<view class="uni-media-list-body">
									<view class="uni-media-list-text-top"> </view>
									<view class="an01">确认</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="Modal_Wrap" v-show="isShowDialog">
			<view class="Model">
				<view class="modelTitle">
					商品名称
				</view>
				<view class="modelContains">
				    <view>
						<text>当前库存</text>
						<input type="number" disabled :value="nowNum"/>
						<text>台</text>
					</view>
					<view>
						<text>修改库存</text>
						<input type="number" @input="changeNum"/>
						<text>台</text>
					</view>
					<view>
						<text>备注</text>
						<text>台</text>
					</view>
				</view>
			    <view class="modalOptions">
					<view @tap="cancel(0)">取消</view>
					<view @tap="cancel(1)">确认</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>

	import uniIcon from '@/components/uni-icon/uni-icon.vue';
	export default {
		data() {
			return {
				kcNum:0,
				nowNum:0,
				isShowDialog:false,
				list:[
					{
						author_avatar:"../../../static/baobiao.png",
						money:12.5,
						money02:125,
						name:"旺仔",
						count:10
					},
					{
						author_avatar:"../../../static/baobiao.png",
						money:12.5,
						money02:125,
						name:"娃哈哈",
						count:10
					},
					{
						author_avatar:"../../../static/baobiao.png",
						money:12.5,
						money02:125,
						name:"娃哈哈",
						count:10
					},
					{
						author_avatar:"../../../static/baobiao.png",
						money:12.5,
						money02:125,
						name:"娃哈哈",
						count:10
					},
					
					
				]
			};
		},
		components:{
		    uniIcon
		},
		methods:{
			backLast:function(){
				uni.navigateBack({
					delta:1
				})
			},
			changeNum:function(event){
				 var value = event.target.value;
				 this.kcNum = value;
			},
			cancel:function(state){
				if(state==0){
					this.isShowDialog = false;
				}else{
					this.nowNum = this.kcNum == ""?0:this.kcNum ;
					this.isShowDialog = false;
				}
				
			},
			changeKc:function(){
				this.isShowDialog = true;
			}
		}
	}
</script>

<style scoped lang="scss">
	@import url("./detail.css");
	@import url("./../../../common/uni.css");

</style>
